<template>
  <div class="loginipt">
    <section @click="telelogin()" class="tele">手机号登陆</section>
    <section class="wei">
      <img src="/img/weix_03.jpg" alt="" /> 微信登录
    </section>
    <p>没有账号</p>
    <section class="reg" @click="toregi">立即注册</section>
  </div>
</template>

<script>
export default {
  methods: {
    toregi() {
      this.$router.push("/register");
    },
    telelogin() {
      this.$router.push("/telelogin");
    },
  },
};
</script>

<style scoped>
section {
  width: 270rem;
  height: 38rem;
  font-size: 13rem;
  color: #fff;
  margin: 0 auto;
  border-radius: 5rem;
  margin-bottom: 23rem;
  line-height: 38rem;
  text-align: center;
}
.tele {
  background: #fe846f;
}
.wei {
  background: #029386;
}
.wei img {
  height: 22rem;
  height: 20rem;
  vertical-align: middle;
}
.reg {
  border: 1px solid #c59d95;
  color: #cf998f;
  background: #fbfaf8;
}
p {
  color: #b8bcbd;
  text-align: center;
  position: relative;
  margin-top: 42rem;
  margin-bottom: 14rem;
}
p::after {
  content: "";
  width: 92rem;
  height: 1px;
  background: #bbb;
  position: absolute;
  top: 5rem;
  left: 20rem;
}
p::before {
  content: "";
  width: 92rem;
  height: 1px;
  background: #bbb;
  position: absolute;
  top: 5rem;
  right: 20rem;
}
</style>
